//GridView
//GirView的用法和ListView类似，只不过由于GridView可以在一列或者一行显示多个Item，
//所以在构造方法中就多了个参数来配置一行（列）有几个Item和Item的间隔

//构造方法:
//GridView({
//Key key,
//Axis scrollDirection: Axis.vertical,
//bool reverse: false,
//ScrollController controller,
//bool primary,
//ScrollPhysics physics,
//bool shrinkWrap: false,
//EdgeInsetsGeometry padding,
//@required this.gridDelegate,//没错，它就是控制GridView的
//bool addAutomaticKeepAlives: true,
//bool addRepaintBoundaries: true,
//List<Widget> children: const <Widget>[],
//})
//看下gridDelegate参数

//可以传入SliverGridDelegateWithFixedCrossAxisCount对象和SliverGridDelegateWithMaxCrossAxisExtent对象。
//其中SliverGridDelegateWithFixedCrossAxisCount可以直接指定每行（列）显示多少个Item，
// SliverGridDelegateWithMaxCrossAxisExtent会根据GridView的宽度和你设置的每个的宽度来自动计算没行显示多少个Item

import 'package:flutter/material.dart';
import 'package:flutter_practice/utils/Utils.dart';

class MyGridViewDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: Utils.getAppBar('gridview'),
      body: GridView(
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3, //列数
          mainAxisSpacing: 10.0, //上下 节点之间间隔
          crossAxisSpacing: 10.0, //左右节点之间间隔
          childAspectRatio: 1.0, //每个孩子的横轴与主轴范围的比率。
        ),
        children: <Widget>[
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
          _backContainer(),
        ],
      ),
    );
  }

  Container _backContainer() {
    return Container(
      color: Colors.red,
      child: Icon(
        Icons.android,
        size: 50.0,
        color: Colors.blue,
      ),
    );
  }
}

// GridView 也有builder模式和custom 模式

class MyGridViewBuilderDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return new MyGridViewBuilderState();
  }
}

class MyGridViewBuilderState extends State<MyGridViewBuilderDemo> {
  final List<MyGirdItemEntity> dataList = [];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    for (int i = 0; i < 30; i++) {
      dataList.add(MyGirdItemEntity('标题$i', Icons.android));
    }
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: Utils.getAppBar('grid builder'),
      body: GridView.builder(
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 3,
            mainAxisSpacing: 10.0,
            crossAxisSpacing: 10.0,
            childAspectRatio: 1.0),
        itemBuilder: (BuildContext content, int dex) {
          return new MyGridItemLayout(dataList[dex]);
        },
        itemCount: dataList.length,
      ),
    );
  }
}

class MyGirdItemEntity {
  String title;
  IconData iconData;

  MyGirdItemEntity(this.title, this.iconData);
}

class MyGridItemLayout extends StatelessWidget {
  MyGirdItemEntity itemEntity;

  MyGridItemLayout(this.itemEntity);

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return GestureDetector(
      child: Container(
        color: Colors.blue,
        child: ListTile(
          leading: Icon(itemEntity.iconData),
          title: Text(itemEntity.title),
        ),
      ),
      onTap: () {
        Scaffold
            .of(context)
            .showSnackBar(SnackBar(content: Text(itemEntity.title)));
      },
    );
  }
}
